<form id="search-form" class="form-inline" role="form" action="{{queryPath}}" method="get">
	<div class="form-group">
		<label class="sr-only" for="so_queryFields">查找字段</label>
		<select id="so_queryFields" name="queryField" style="min-width:120px">
		{{#queryFields}}
			<option value="{{key}}" {{#selected}}selected{{/selected}}>{{value}}</option>
		{{/queryFields}}
		</select>
	</div>
	<div class="form-group">
		<label class="sr-only" for="so_queryValue">查找内容</label>
		<div class="input-group" style="width:300px">
    		<input type="text" id="so_queryValue" name="queryValue" value="{{queryValue}}" class="form-control"/>
			<input type="hidden" id="so_dynamicFilter"/>
    		<span class="input-group-btn">
				<button id="so_go" class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span>查找</button>
			</span>
		</div>
	</div>
	<div class="form-group">
		<label class="sr-only">排序</label>
		<div class="btn-group">
		{{#sortInfo}}
		  <button type="button" class="btn btn-info btn-default dropdown-toggle" data-toggle="dropdown">
		    排序：{{currentSortEntry.text}}
		    {{^noneSortEntry}}
			    {{#currentSortEntry.asc}}↑{{/currentSortEntry.asc}}
			    {{^currentSortEntry.asc}}↓{{/currentSortEntry.asc}}
		    {{/noneSortEntry}}
		    <span class="caret"></span>
		  </button>
		  <ul class="dropdown-menu" role="menu">
		  	{{#sortEntrys}}
		    <li>
		    	<a href="?st_{{name}}={{nextDir}}{{#filterExp}}&{{filterExp}}{{/filterExp}}">
		    	{{text}} 
		    	{{#selected}}
			    	{{#nextAsc}}↑{{/nextAsc}}
			    	{{^nextAsc}}↓{{/nextAsc}}
		    	{{/selected}}
		    	</a>
		    </li>
		    {{/sortEntrys}}
		  </ul>
		{{/sortInfo}}
		</div>
	</div>
	{{#otherParams}}
	<input type="hidden" name="{{key}}" value="{{value}}"/>
	{{/otherParams}}
</form>
<script type="text/javascript">
	$(document).ready(function() {
	   	var txtDynamicFilter=$("#so_dynamicFilter"),
	   		selQueryField=$("#so_queryFields")
	   		txtQueryValue=$("#so_queryValue");
	   	selQueryField.on("change", function(evt){
			 var name=$(this).children('option:selected').val();
			 txtDynamicFilter.attr('name',name);
			 txtDynamicFilter.val(txtQueryValue.val());
		});
	   	$('#so_go').on("click", function(evt){
	   		var name=selQueryField.children('option:selected').val();
	   		txtDynamicFilter.attr('name', name);
	   		txtDynamicFilter.val(txtQueryValue.val());
	   	});
	   	selQueryField.trigger("change");
	});
</script>